<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8"/>
        <title>初识Vue</title>
        <script type="text/javascript" src="../js/vue.js"></script>
    </head>
    <body>
       
 <!--准备好一个容器-->
 <div id="root">
   
 </div>

        <script type="text/javascript">
           let number = 18
           let person = {
            name : '张三',
            sex : '男'
           }

           Object.defineProperty(person,'age',{
            value : 18, //直接设置值
            enumerable : true,  //控制属性是否可以被枚举（遍历），默认false
            writable : true , //控制属性是否可以被修改，默认fasle
            configurable : true, //控制属性是否可以被删除，默认false
            //当有人读取person的age属性时，get函数就会被调用，且返回age的值
            get(){
                console.log('有人读取age属性')
                return number
            },
            //当有人修改person的age属性时，set函数就会被调用，且会收到修改的具体值
            set(value){
             console.log('有人修改了age属性，且值为',value);
             number = value;
            }

           })
        </script>
    </body>
</html>
</html>